<template>
  <!--质量问题模板-->
  <section class="content">
    <mu-expansion-panel>
      <div slot="header">问题</div>
      <div class="content">
        <mu-form
          ref="form"
          :model="form"
          class="mu-demo-form"
          :label-position="labelPosition"
          label-width="100"
        >
          <mu-form-item prop="problemTypeId" help-text="选择问题类型" label="问题类型" :rules="problemTypeId">
            <mu-select v-model="form.problemTypeId" style="height:0.2rem;">
              <mu-option
                v-for="(option, index) in questionTypeOptions"
                :key="index"
                :label="option.problemTypeId"
                :value="option.id"
              ></mu-option>
            </mu-select>
          </mu-form-item>
          <mu-form-item prop="problemLevel" help-text="选择问题等级" label="问题等级" :rules="problemLevel">
            <mu-radio v-model="form.problemLevel" value="0" label="重大问题"></mu-radio>
            <mu-radio v-model="form.problemLevel" value="1" label="较大问题"></mu-radio>
            <mu-radio v-model="form.problemLevel" value="2" label="一般问题"></mu-radio>
          </mu-form-item>
          <mu-form-item
            label="问题描述"
            help-text="请输入问题描述"
            prop="problemDescription"
            :rules="problemDescription"
          >
            <mu-text-field v-model="form.problemDescription"></mu-text-field>
          </mu-form-item>
          <mu-form-item prop="endTime" label="整改期限" help-text="请选择整改期限" :rules="endTime">
            <mu-date-input clock-type="24hr" value-format="YYYY-MM-DD HH:mm:ss" v-model="form.endTime" type="dateTime" actions></mu-date-input>
          </mu-form-item>
          <mu-form-item
            prop="isCurrentRect"
            help-text="请选择是否现场整改"
            label="现场整改"
            :rules="isCurrentRect"
          >
            <mu-radio v-model="form.isCurrentRect" @change="Rectification" value="0" label="是"></mu-radio>
            <mu-radio v-model="form.isCurrentRect" @change="Rectification" value="1" label="否"></mu-radio>
          </mu-form-item>
          <mu-form-item
            prop="rectificationRequirements"
            help-text="请输入整改要求"
            label="整改要求"
            :rules="rectificationRequirements"
          >
            <mu-text-field v-model="form.rectificationRequirements"></mu-text-field>
            <!-- <mu-select v-model="form.rectificationRequirements" style="height:0.2rem;">
              <mu-option
                v-for="(option,index) in options"
                :key="index"
                :label="option"
                :value="option"
              ></mu-option>
            </mu-select>-->
          </mu-form-item>
          <mu-form-item
            prop="responsibleUnitId"
            help-text="请选择责任单位"
            label="责任单位"
            :rules="responsibleUnitId"
          >
            <mu-select v-model="form.responsibleUnitId" style="height:0.2rem;">
              <mu-option
                      v-for="(person,index) in options"
                      :key="index"
                      :label="person.name"
                      :value="person.id"
              ></mu-option>
            </mu-select>
          </mu-form-item>
          <mu-form-item
            prop="responsibleUserId"
            label="整改责任人"
            help-text="请选择整改责任人"
            :rules="responsibleUserId"
          >
            <mu-select v-model="form.responsibleUserId" style="height:0.2rem;">
              <mu-option
                v-for="(person,index) in responsibleOptions"
                :key="index"
                :label="person.fullName"
                :value="person.id"
              ></mu-option>
            </mu-select>
          </mu-form-item>
          <mu-form-item prop="reviewUser" label="复查人" help-text="请选择复查人" :rules="reviewUser">
            <mu-select v-model="form.reviewUser" style="height:0.2rem;">
              <mu-option
                v-for="(person, index) in reviewerOptions"
                :key="index"
                :label="person.fullName"
                :value="person.id"
              ></mu-option>
            </mu-select>
          </mu-form-item>
          <mu-form-item
            prop="rectCopyUserIds"
            help-text="请选择抄送人"
            label="抄送人"
            :rules="rectCopyUserIds"
          >
            <mu-select filterable multiple v-model="form.rectCopyUserIds" full-width>
              <mu-option v-for="(person, index) in carbonCopyRecipientsOptions" :key="index" :label="person.fullName" :value="person.id"></mu-option>
            </mu-select>
          </mu-form-item>
          <mu-form-item style="display: flex;justify-content: space-around">
            <mu-button small @click="clear">重置</mu-button>
            <mu-button small @click="submit" color="primary">保存</mu-button>
          </mu-form-item>
        </mu-form>
      </div>
    </mu-expansion-panel>
  </section>
</template>

<script>
import apis from "../../services/apis";
export default {
  name: "problem-template",
  data() {
    return {
      questionTypeOptions: [], // 问题类型选项
      dutyUnitOptions: [], // 责任单位选项
      responsibleOptions: [], // 责任人选项
      reviewerOptions: [], // 复查人选项
      carbonCopyRecipientsOptions: [], // 抄送人选项

      problemTypeId: [
		{ validate: val => !!val, message: "必须选择问题类型" }
	  ],
      problemLevel: [{ validate: val => !!val, message: "必须选择问题等级" }],
      problemDescription: [
        { validate: val => !!val, message: "必须填写问题描述" },
        { validate: val => val.length <= 150, message: "问题描述长度超过150" }
      ],
      endTime: [{ validate: val => !!val, message: "必须选择整改期限" }],
      isCurrentRect: [{ validate: val => !!val, message: "必须选择现场整改" }],
      rectificationRequirements: [
        { validate: val => !!val, message: "必须填写整改要求" },
        { validate: val => val.length <= 150, message: "整改要求长度超过150" }
      ],
      responsibleUnitId: [
        // { validate: val => !!val, message: "必须选择责任单位" }
      ],
      responsibleUserId: [
        { validate: val => !!val, message: "必须选择整改责任人" }
      ],
      reviewUser: [{ validate: val => !!val, message: "必须选择整复查人" }],
      rectCopyUserIds: [{ validate: val => !!val, message: "必须选择抄送人" }],
      citys: [],
      options: [],
      labelPosition: "top",

      form: {
        //  /checkTask/submit
        problemTypeId: "", //问题类型
        problemLevel: "", //问题等级
        problemDescription: "", //问题描述
        endTime: "", //整改期限
        isCurrentRect: "", //现场整改
        rectificationRequirements: "", //整改要求
        responsibleUnitId: "", //整改单位
        responsibleUserId: "", //整改人
        reviewUser: "", //复查人
        rectCopyUserIds: [] //抄送人
      }
    };
  },
  mounted() {
	  this.loadPersonOptions();
	  this.Participating();
	  this.type();
  },
  methods: {
    //提交
    submit() {
      this.$refs.form.validate().then(result => {
        console.log("form valid: ", result);
        console.log("form: ", this.form);
        let problemList = {
            problemDescription:this.form.problemDescription,//问题描述
            problemLevel:this.form.problemLevel,//问题等级
            problemTypeId:this.form.problemTypeId,//问题类型
            rectifyDto:{
                endTime:this.form.endTime,//整改期限
                isCurrentRect:this.form.isCurrentRect,//现场整改
                rectCopyUserIds:this.form.rectCopyUserIds,//抄送人
                rectificationRequirements:this.form.rectificationRequirements,//整改要求
                responsibleUnitId:this.form.responsibleUnitId,//整改单位
                responsibleUserId:this.form.responsibleUserId,//整改人
                reviewUser:this.form.reviewUser//复查人
            }
        };
          console.log(problemList);
          this.$emit("ProblemChange", problemList);
      });
    },
    //重置
    clear() {
      this.$refs.form.clear();
      this.form = {};
    },
    //整改
    Rectification() {},
    loadPersonOptions() {
      this.$A
        .Go("post", apis.check_task_person_options, {
          obj: {
            projectId: "60820044036178326"
          },
          pageNo: 1,
          pageSize: 10
        })
        .then(res => {
			const { code, msg, body } = res;
			console.log('res:', res);
			if (code === 200) {
				this.responsibleOptions = body;
				this.reviewerOptions = body;
				this.carbonCopyRecipientsOptions = body;
			} else {

			}
        });
    },
    //参建单位
      Participating () {
          this.$A.Go('post', '/safety/corp/', {
              obj: {
                  category: "1",  // 参建单位类型(1:分包单位;2:业主单位;3:监理单位)
                  name: "测试",  // 参建单位名称
                  projectId: "60820044036178326"  // 项目ID
              },
              pageNo: 1,
              pageSize: 10
          }).then((success) => {
              if (success.code == 200) {
                  this.options = success.body;
                  console.log(this.options);
              }
          })
      },
      //问题类型
      type () {
          this.$A.Go('post', '/safety/problemItem/pageList', {
              pageNo:-1,
              pageSize:10,
          }).then((success) => {
              if (success.code == 200) {
                  this.questionTypeOptions=success.body.rows;
              }
          })
      }
  }
};
</script>

<style scoped lang="scss">
.content {
  width: 100%;
  height: 100%;
  overflow: auto;
}
</style>
